import Sprite from '../base/sprite'
import DataBus   from '../databus'

const BOY_IMG_SRC = 'images/boy.png'
const MOM_IMG_SRC = 'images/mom.png'
const WIDTH   = 150
const HEIGHT  = 160
const CHECK_SRC = 'images/check.png'
const CROSS_SRC = 'images/cross.png'
const TAG_WIDTH = 150
const TAG_HEIGHT = 160

const databus = new DataBus()
const gridConfig = databus.gridConfig

export default class People extends Sprite {
    constructor(type) {
        super({
            imgW: WIDTH,
            imgH: 0,
            imgX: 48,
            imgY: 20,
            canvasW: gridConfig.unitW*1.3,
            canvasH: 0,
            canvasX: 0,
            canvasY: 0
        })
        this.frame = 0
        this.status = 'WAIT'
        // canvas和img的比例
        this.ratioH = gridConfig.unitH*1.1 / HEIGHT
    }

    init(pos, canvasX, canvasY, type, speed, pause) {
        // console.log(`new ${type ? 'mom' : 'boy'} generated at pos:${pos}`)
        this.status = 'UP'
        this.pos = pos
        this.type = type
        this.speed = speed
        this.pause = pause
        this.canvasX = canvasX + gridConfig.unitW*.1
        this.canvasY0 = canvasY
        this.img.src = type ? MOM_IMG_SRC : BOY_IMG_SRC
    }

    update(ctx) {
        this.frame++
        switch(this.status) {
            case 'UP':
                if(this.imgH <= HEIGHT) {
                    this.imgH += this.speed
                    this.canvasH = this.imgH * this.ratioH
                    // canvasY越来越靠上 所以其实是越来越小的
                    this.canvasY = this.canvasY0 + (gridConfig.unitH - this.canvasH)
                } else {
                    this.status = 'PAUSE'
                    this.pauseStart = this.frame
                }
                break
            case 'PAUSE':
                // if (this.frame - this.pauseStart === this.pause) this.status = 'DOWN'
                break
            case 'DOWN':
                if(this.imgH > 0) {
                    this.imgH -= this.speed
                    this.canvasH = this.imgH * this.ratioH
                    this.canvasY = this.canvasY0 + (gridConfig.unitH - this.canvasH)
                } else {
                    this.status = 'REMOVED'
                    databus.removePerson(this)
                }
                break
            case 'TAPPED':
                this.addTag(ctx)
        }
    }

    addTag(ctx) {
        console.log(this.pos)
        const img = new Image()
        img.src = this.tappedResult ? CHECK_SRC : CROSS_SRC
        // ctx.drawImage(
        //     img,
        //     0, 0, 150, 160,
        //     databus.grid[this.pos].x, databus.grid[this.pos].y, databus.gridConfig.unitW, databus.gridConfig.unitH
        //   )
          ctx.drawImage(
            this.img,
            0, 0, 150, 160,
            0, 0, 50, 50
          )
    }

    // 被手指戳中时
    tapped() {
        this.status = 'TAPPED'
        if(this.type === 0) {
            databus.score++
            this.tappedResult = true
        } else {
            this.tappedResult = false
        }
    }
}